<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Layui</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link rel="stylesheet" href="../plugins/layui/css/layui.css" media="all" />
		<link rel="stylesheet" href="../css/global.css" media="all">
		<link rel="stylesheet" href="../css/table.css" />
	</head>
	<body>
		<div class="admin-main">
	
			<blockquote class="layui-elem-quote">
				<div style="margin: 5px;">
				<form class="layui-form" action="">
					<div class="layui-form-item">
						<label class="layui-form-label">文档类型</label>
						<div class="layui-input-inline">
							<select name="interest" lay-filter="aihao">
								<option>微软Word文字(.doc)</option>
								<option>微软Excel表格(.xls)</option>
								<option>微软PowerPoint演示(.ppt)</option>
								<option>金山WPS文字(.wps)</option>
								<option>金山WPS表格(.et)</option>
								<option>金山WPS演示(.dps)</option>
							</select>
						</div>
						<label class="layui-form-label">模版</label>
						<div class="layui-input-inline">
							<select name="interest2" lay-filter="aihao">
								<option>不使用模版</option>
							</select>
						</div>
					</div>
					
				</form>
			</blockquote>
			<div class="layui-input-inline" style="margin: 10px;">
							<a href="javascript:;" class="layui-btn layui-btn-small" id="roleAdd">
								 新建文档
							</a>
							<a href="javascript:;" class="layui-btn layui-btn-small" id="roleAdd">
								模版管理
							</a>
							<a href="javascript:;" class="layui-btn layui-btn-small" id="roleAdd">
								 签章管理
							</a>
							<a href="javascript:;" class="layui-btn layui-btn-small" id="roleAdd">
								 书签管理
							</a>
						</div>
				<div>
			<fieldset class="layui-elem-field" style="margin: 10px;">
				<div class="layui-field-box layui-form">
					<table class="layui-table admin-table">
						<thead>
							<tr>
								<th style="width: 30px;"><input type="checkbox" lay-filter="allselector" lay-skin="primary"></th>
								<th>编号</th>
								<th>文档编号</th>
								<th>标题</th>
								<th>作者</th>
								<th>类型</th>
								<th>日期</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody id="content">
						</tbody>
					</table>
				</div>
				<div class="layui-field-box layui-form" style="margin-bottom: 15px;" align="middle">
				<a href="javascript:;" class="layui-btn layui-btn-small" id="roleAdd">
					 修改无痕迹
				</a>
				<a href="#" class="layui-btn layui-btn-small" id="roleEdit">
					修改有痕迹
				</a>
				<a href="#" class="layui-btn layui-btn-small" id="roleDelete" >
					领导手写圈批
				</a>
				<a href="#" class="layui-btn layui-btn-small" id="roleDelete" style="width: 100px;">
					 核稿
				</a>
				<a href="#" class="layui-btn layui-btn-small" id="roleDelete" style="width: 100px;">
					 套红
				</a>
				<a href="#" class="layui-btn layui-btn-small" id="roleDelete" style="width: 100px;">
					 盖章
				</a>
				</div>
			</fieldset>
			<div class="admin-table-page">
				<div id="paged" class="page">
				</div>
			</div>
		</div>
		<!--模板-->
		<script type="text/html" id="tpl">
			{{# layui.each(d.rows, function(index, item){ }}
			<tr>
				<td><input type="checkbox" lay-skin="primary" value="{{item.accountId}}" name="checkbox"></td>
				<td>{{ item.accountId }}</td>
				<td>{{ item.fileNo }}</td>
				<td>{{ item.title }}</td>
				<td>{{ item.author }}</td>
				<td>{{ item.type }}</td>
				<td>{{ item.date }}</td>
				<td>
					<a href="javascript:;" data-name="{{item.accountId}}" data-opt="view" target="_blank" class="layui-btn layui-btn-normal layui-btn-mini">阅读</a>
					<a href="javascript:;" data-name="{{item.accountId}}" data-opt="del" class="layui-btn layui-btn-danger layui-btn-mini">删除</a>
				</td>
			</tr>
			{{# }); }}
		</script>
	<script type="text/javascript" src="../plugins/layui/layui.js"></script>
	<script>
			layui.config({
				base: '../js/'
			});

			layui.use(['datagrid', 'form'], function() {
				var $ = layui.jquery,
					datagrid = layui.datagrid(),
					layerTips = parent.layer === undefined ? layui.layer : parent.layer, //获取父窗口的layer对象
					layer = layui.layer, //获取当前窗口的layer对象
					form = layui.form();

				datagrid.init({
					url: '../datas/fileList.json', //地址
					elem: '#content', //内容容器
					params: { //发送到服务端的参数
					},
					type: 'GET',
					tempElem: '#tpl', //模块容器
					/**
					 * a标签按钮点击事件（用到哪个属性添加对应的a标签属性，传参时同理）
					 * a标签里添加属性data-opt="edit"、data-opt="view"、data-opt="del"
					 * aClickEvent属性在传值的时候，view、edit、del三个key给指定的事件响应方法
					 */
					aClickEvent:{"view":viewEvent,"del":delEvent},
					pageConfig: { //分页参数配置
						elem: '#paged', //分页容器
						pageSize: 2 //分页大小
					},
					success: function() { //渲染成功的回调
						//alert('渲染成功');
					},
					fail: function(msg) { //获取数据失败的回调
						//alert('获取数据失败')
					},
					complate: function() { //完成的回调
						form.render('checkbox');
						/*
						 * 全选或反选,使用时需要传递1个参数
						 * 参数：指定某一个复选框，参数形式为：[checkbox(params)]，params是lay-filter属性的值
						 */
						datagrid.render('checkbox(allselector)');
					}//complate结束
				});
			});//layui.use的结束
			function viewEvent() {
			}
			function delEvent() {
			}
		</script>
	</body>
</html>
